import React, { useState } from 'react';
import CommonPage from '@/components/page/CommonPage';
import { useModel } from 'umi';
import { renderNumber } from '@/utils/common';
const daoName = 'ShAsseZbDept';
const importName = 'ShAsseZbDept';

const columns: API.Column[] = [
  {
    title: '指标名称',
    width: 250,
    sorter: true,
    dataIndex: 'ZBMC',
    key: 'ZBMC',
    dispaly: true,
    filter: true,
    export: true,
  },
  {
    title: '机构',
    width: 110,
    sorter: true,
    dataIndex: 'UTNM',
    key: 'UTNM',
    dispaly: true,
    filter: true,
    export: true,
  },
  {
    title: '年份',
    width: 70,
    sorter: true,
    dataIndex: 'NF',
    key: 'NF',
    dispaly: true,
    filter: false,
    export: true,
  },
  {
    title: '基期',
    width: 100,
    sorter: true,
    dataIndex: 'JQ',
    key: 'JQ',
    dispaly: true,
    filter: true,
    export: true,
  },
  {
    title: '增量',
    width: 100,
    sorter: true,
    dataIndex: 'ZL',
    key: 'ZL',
    dispaly: true,
    filter: true,
    export: true,
    align: 'right',
    render: (data) => renderNumber('.2f', data),
  },
  {
    title: '目标值',
    width: 100,
    sorter: true,
    dataIndex: 'MBZ',
    key: 'MBZ',
    dispaly: true,
    filter: true,
    export: true,
    align: 'right',
    render: (data) => renderNumber('.2f', data),
  },
  {
    title: '一月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL1',
        key: 'ZL1',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB1',
        key: 'MB1',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '一月',
  },
  {
    title: '二月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL2',
        key: 'ZL2',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB2',
        key: 'MB2',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '二月',
  },
  {
    title: '三月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL3',
        key: 'ZL3',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB3',
        key: 'MB3',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '三月',
  },
  {
    title: '四月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL4',
        key: 'ZL4',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB4',
        key: 'MB4',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '四月',
  },
  {
    title: '五月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL5',
        key: 'ZL5',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB5',
        key: 'MB5',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '五月',
  },
  {
    title: '六月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL6',
        key: 'ZL6',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB6',
        key: 'MB6',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '六月',
  },
  {
    title: '七月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL7',
        key: 'ZL7',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB7',
        key: 'MB7',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '七月',
  },
  {
    title: '八月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL8',
        key: 'ZL8',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB8',
        key: 'MB8',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '八月',
  },
  {
    title: '九月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL9',
        key: 'ZL9',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB9',
        key: 'MB9',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '九月',
  },
  {
    title: '十月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL10',
        key: 'ZL10',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB10',
        key: 'MB10',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '十月',
  },
  {
    title: '十一月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL11',
        key: 'ZL11',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB11',
        key: 'MB11',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '十一月',
  },
  {
    title: '十二月',
    children: [
      {
        title: '增量',
        width: 100,
        sorter: true,
        dataIndex: 'ZL12',
        key: 'ZL12',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
      {
        title: '目标',
        width: 100,
        sorter: true,
        dataIndex: 'MB12',
        key: 'MB12',
        dispaly: true,
        filter: true,
        export: true,
        align: 'right',
        render: (data) => renderNumber('.2f', data),
      },
    ],
    dispaly: true,
    dataIndex: '十二月',
  },
];
const controls: API.Control[] = [
  { name: 'ZBMC', type: 'text', label: '指标名称', grid: 12 / 24 },
  { name: 'UTNM', type: 'text', label: '机构', grid: 12 / 24 },
  {
    name: 'NF',
    type: 'text',
    label: '年份',
    grid: 12 / 24,
    placeholder: '按YYYY格式输入,例如:2019',
    rules: [{ min: 4, max: 4, message: '不能大于4，或小于4' }],
  },
  { name: 'JQ', type: 'number', dataType: 'number', label: '基期', grid: 12 / 24 },
  { name: 'ZL', type: 'number', dataType: 'number', label: '增量', grid: 12 / 24 },
  { name: 'MBZ', type: 'number', dataType: 'number', label: '目标值', grid: 12 / 24 },
  { name: 'ZL1', type: 'number', dataType: 'number', label: '一月增量', grid: 12 / 24 },
  { name: 'MB1', type: 'number', dataType: 'number', label: '一月目标', grid: 12 / 24 },
  { name: 'ZL2', type: 'number', dataType: 'number', label: '二月增量', grid: 12 / 24 },
  { name: 'MB2', type: 'number', dataType: 'number', label: '二月目标', grid: 12 / 24 },
  { name: 'ZL3', type: 'number', dataType: 'number', label: '三月增量', grid: 12 / 24 },
  { name: 'MB3', type: 'number', dataType: 'number', label: '三月目标', grid: 12 / 24 },
  { name: 'ZL4', type: 'number', dataType: 'number', label: '四月增量', grid: 12 / 24 },
  { name: 'MB4', type: 'number', dataType: 'number', label: '四月目标', grid: 12 / 24 },
  { name: 'ZL5', type: 'number', dataType: 'number', label: '五月增量', grid: 12 / 24 },
  { name: 'MB5', type: 'number', dataType: 'number', label: '五月目标', grid: 12 / 24 },
  { name: 'ZL6', type: 'number', dataType: 'number', label: '六月增量', grid: 12 / 24 },
  { name: 'MB6', type: 'number', dataType: 'number', label: '六月目标', grid: 12 / 24 },
  { name: 'ZL7', type: 'number', dataType: 'number', label: '七月增量', grid: 12 / 24 },
  { name: 'MB7', type: 'number', dataType: 'number', label: '七月目标', grid: 12 / 24 },
  { name: 'ZL8', type: 'number', dataType: 'number', label: '八月增量', grid: 12 / 24 },
  { name: 'MB8', type: 'number', dataType: 'number', label: '八月目标', grid: 12 / 24 },
  { name: 'ZL9', type: 'number', dataType: 'number', label: '九月增量', grid: 12 / 24 },
  { name: 'MB9', type: 'number', dataType: 'number', label: '九月目标', grid: 12 / 24 },
  { name: 'ZL10', type: 'number', dataType: 'number', label: '十月增量', grid: 12 / 24 },
  { name: 'MB10', type: 'number', dataType: 'number', label: '十月目标', grid: 12 / 24 },
  { name: 'ZL11', type: 'number', dataType: 'number', label: '十一月增量', grid: 12 / 24 },
  { name: 'MB11', type: 'number', dataType: 'number', label: '十一月目标', grid: 12 / 24 },
  { name: 'ZL12', type: 'number', dataType: 'number', label: '十二月增量', grid: 12 / 24 },
  { name: 'MB12', type: 'number', dataType: 'number', label: '十二月目标', grid: 12 / 24 },
];

const ShAsseZbDeptForm: React.FC = () => {
  const { edwDate } = useModel('@@initialState', (ret: any) => ({
    edwDate: ret.initialState?.sys?.edwDate,
  }));
  const options: API.OptionItem[] = [];
  const year = new Date(edwDate!).getFullYear();
  for (let i = year; i >= year - 10; i--) {
    options.push({ label: `${i}年`, value: i });
  }
  const [selDate, setSelDate] = useState<number>(year);
  const setParas2 = (row: Record<string, any>) => {
    setSelDate(row.NF);
  };
  return (
    <CommonPage
      daoName={daoName}
      columns={columns}
      controls={controls}
      title="综合经营指标计划"
      importName={importName}
      importControls={controls}
      importMode="DeleteAfterInsert"
      importParamNames={['NF']}
      importTemplateName="综合经营指标计划导入"
      initSorter={{ FieldName: 'ORDER', Direction: 'ASC' }}
      onShortcutChange={async (vals) => setParas2(vals)}
      importParamVals={{
        NF: '' + selDate,
      }}
      shortcutFilters={{
        controls: [{ name: 'NF', label: '年份', type: 'select', options, initValue: selDate }],
      }}
    />
  );
};

export default ShAsseZbDeptForm;
